<template>
    <div class="booking-detail">
		<div>
			<span class="fSize18">预约状态</span>
			<ul>
				<li>
					预约ID: {{appoint_status.id}}
				</li>
				<li>
					预约状态: {{appoint_status.reservation_status_name}}
				</li>
				<li>
					预约类型: {{appoint_status.type_name}}
				</li>
			</ul>
		</div>
		<div>
			<span class="fSize18">预约状态</span>
			<ul>
				<li>
					创建时间: {{appoint_info.add_time}}
				</li>
				<li>
					预约到店日期: {{appoint_info.arrive_date}}
				</li>
				<li>
					预约到店时间: {{appoint_info.arrive_time}}
				</li>
				<li>
					预约客户姓名: {{appoint_info.member_name}}
				</li>
				<li>
					预约客户电话: {{appoint_info.mobile}}
				</li>
				<li>
					<!-- kong -->
				</li>
				<br>
				<li>
					预约顾问: {{appoint_info.adviser_name}}
				</li>
				<li>
					顾问手机号: {{appoint_info.adviser_phone}}
				</li>
				<li>
					预约店铺: {{appoint_info.store_name}}
				</li>
				<li>
					受理时间: {{appoint_info.handle_time}}
				</li>
				<li>
					优惠信息: {{appoint_info.arrive_info}}
				</li>
				<li>
					完成时间: {{appoint_info.finish_time}}
				</li>
			</ul>
		</div>
		<div>
			<span class="fSize18">用户信息</span>
			<ul>
				<li>
					用户账号: {{user_info.user_name}}
				</li>
				<li>
					用户姓名: {{user_info.member_truename}}
				</li>
				<li>
					手机号: {{user_info.member_mobile}}
				</li>
				<li>
					车牌号: {{user_info.plate_number}}
				</li>
				<li>
					车型: {{user_info.car_name}}
				</li>
			</ul>
		</div>
		 <el-button type="primary" @click="goBank">返回</el-button>
    </div>
</template>

<script>
	import { resize } from "@/common/js/height.js";
	import {dateFormatter} from "../../../../common/js/util";

	export default {
		data() {
			return {
				appoint_status:{},
				appoint_info:{},
				user_info:{}
            }
        },
        methods: {
	        getListData(){
				let id = this.$route.query.id;
				console.log('id',id)
				this.$http.get('/admin/appointment/index.php?act=appoint&op=detail',{params:{id}}).then((res) =>{
					console.log(res)
					if(res.code==1&&res.data){
						this.appoint_status=res.data.appoint_status,
						this.appoint_info=res.data.appoint_info,
						this.user_info=res.data.user_info
					}
				})
			},
			goBank(){
				this.$router.go(-1);
			}
        },
        mounted() {
	        resize(this)
        },
		created() {
			this.$parent.tabLists = [
				{"label": "预约管理", "name": 'booking-index'},
				{"label": "预约详情", "name": 'booking-detail'}
			]
			this.getListData();
		},
		name: "booking-detail"
	}
</script>

<style lang="scss" scoped>
    .on-sale-good-car {
        .search-content {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            &-input {
                width: 200px;
            }
            .putaway-time-wrapper {
                .putaway-time-label {
                    font-size: 14px;
                }
                display: flex;
                align-items: center;
                /deep/.el-range-separator {
                    box-sizing: content-box;
                }
            }
        }
    }
	.booking-detail{
		padding: 30px 20px  20px;
		.fSize18{
			font-size:18px;
			font-weight:600;
		}
		ul{
			display: flex;
			font-size: 14px;
    		padding-left: 50px;
			flex-wrap: wrap;
			li{
				width:33%;
				padding:15px 0;
			}
		}
	}
	
</style>